iT邦幫忙

2024 iThome 鐵人賽

DAY 17
1
佛心分享-SideProject30

收納規劃APP系列 第 17

Day17:資料流綁定

  • 分享至 

  • xImage
  •  

本日進度 Day17

不確定大家知不知道怎麼操作Demo
stackblitz會自己處理好環境跟指令
等到跑完之後,會出現目錄,之後點對應的日期就可以看了
https://ithelp.ithome.com.tw/upload/images/20240929/20162350NcKRwcbget.png

因為還沒寫後端跟資料庫,所以先透過改陣列看看效果
顏色可以有透明效果、框線的類型有solid、dash、none

  furnitureList: Furniture[] = [
    {
      id: '0', name: '沙發', x: 150, y: 100, width: 120, height: 60, color: 'lightblue', rotation: 0,
      isStorage: false, borderColor: 'black', borderType: 'dash', index: 1
    },
    {
      id: '1', name: '桌子', x: 300, y: 200, width: 80, height: 80, color: 'brown', rotation: 0,
      isStorage: false, borderColor: 'black', borderType: 'none', index: 0
    },
    {
      id: '2', name: '床', x: 300, y: 70, width: 150, height: 80, color: 'beige', rotation: 0,
      isStorage: false, borderColor: 'black', borderType: 'solid', index: 2
    },
    {
      id: '3', name: '收納櫃', x: 51, y: 51, width: 60, height: 100, color: 'burlywood', rotation: 0,
      isStorage: true, borderColor: 'black', borderType: 'solid', index: 4
    }
    ,
    {
      id: '4', name: '椅子', x: 250, y: 225, width: 40, height: 40, color: '#cb666675', rotation: 0,
      isStorage: false, borderColor: 'black', borderType: 'solid', index: 3
    }
  ];

https://ithelp.ithome.com.tw/upload/images/20240929/20162350IZxdMLbX8R.png


上一篇
Day16:點擊家具出現收納清單
下一篇
Day18:設計資料庫跟API
系列文
收納規劃APP32
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言